<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        p {
            font-family: 'helvetica neue', Helvetica, sans-serif;
            letter-spacing: 1px;
            text-transform: uppercase;
            text-align: center;
            border: 2px solid rgba(0, 0, 200, 0.6);
            background: rgba(0, 0, 200, 0.6);
            color: rgba(0, 0, 200, 0.6);
            box-shadow: 1px 1px 2px rgba(0, 0, 200, 0.6);
            border-radius: 10px;
            padding: 3px 10px;
            display: inline-block;
            cursor: pointer;
        }
    </style>
</head>
<body>
<!--<p>Player 1:Chris</p>-->
<button>按钮</button>
<script>
    //    var para=document.querySelector("p");
    //    para.addEventListener('click',updateName);
    //
    //    function updateName(){
    //        var name=prompt('Enter a new name');
    //        para.textContent='Player 1:'+name;
    //    }


    function createParagraph() {
        var para = document.createElement('p');
        para.textContent = 'You clicked the button!';
        document.body.appendChild(para);
    }

    var buttons = document.querySelectorAll('button');

    for (var i = 0; i < buttons.length; i++) {
        buttons[i].addEventListener('click', createParagraph);
    }

</script>
</body>
</html>